<template>
    <div class="order-report-ktv-manage">
        <div style="background: #fff">
            <el-tabs v-model="activeName">
                <el-tab-pane
                    v-for="(item, index) in tabList"
                    :key="index"
                    :label="item.name"
                    :name="item.key"
                >
                    <component :is="item.key"></component>
                </el-tab-pane>
            </el-tabs>
            <div class="page-padding"></div>
        </div>
    </div>
</template>

<script type="text/ecmascript-6">
import transactionOrder from './components/transactionOrder.vue'
import orderManage from './components/orderManage.vue'
import refundOrder from './components/refundOrder.vue'

export default {
    data: function () {
        return {
            activeName: 'transactionOrder',
            tabList: [
                { name: '交易订单', key: 'transactionOrder' },
                { name: '买单二维码管理', key: 'orderManage' },
                { name: '退款订单', key: 'refundOrder' }
            ]
        }
    },
    mounted () {
        this.activeName = 'transactionOrder'
    },
    created () {
    },
    watch: {
    },
    components: {
        transactionOrder,
        refundOrder,
        orderManage
    },
    props: {
    },
    computed: {
    },
    methods: {
    }
}
</script>

<style lang="stylus" rel="stylesheet/stylus">
.order-report-ktv-manage
    width: 100%
</style>
